<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>产品开发 - 产品数据管理系统</title>
{include file='top.tpl'}
<style>
{literal}
.box-body{min-height:350px;}
.table-toolbar .columns-right{position:relative;}
.table-toolbar .dropdown-menu{right:0;left:auto;max-height:340px;overflow:auto;}
.table-toolbar .dropdown-menu li{padding:5px 15px;}
.table-toolbar .dropdown-menu li p{margin:0;}
.img-thumbnail{width:50px;height:50px;}
.nav-tabs-custom{box-shadow:none;margin:10px 10px 0px 10px;}

.slct{display:inline-block; width:auto;}
{/literal}
</style>
</head>
<body class="skin-blue">
<div class="wrapper">
	{include file='bread_crumbs.tpl'}
	<!--引入面包屑-->
	<section class="base-setting-wrap">
		<div class="row">
			<div class="col-md-12">
				<div class="box">
					<div class="nav-tabs-custom">
						<ul class="nav nav-tabs">
					      <li ><a href="/purchase/sample-cloth/sample">样衣需求列表</a></li>
					      <li class="active"><a href="/purchase/sample-cloth/fb">样衣推广跟踪表</a></li>					      
					    </ul>
				    </div>
	                <div class="box-header with-border clearfix">
	                		                	
	                	<div class="box-form pull-right form-group-sm">
	                		<p class="pull-right">
	                			<a href="javascript:;" class="btn btn-success btn-sm" id="js_toggleSearchBox"><i class="fa fa-search"></i><span class="pl5">搜索选项</span></a>
	                		</p>
	                	</div>
	                	<div class="clearfix"></div>
						<div class="search-box" id="js_searchBox">
							<form method="get" class="form-inline">
								<div class="form-group-sm">	
									<p>
										<label class="control-label">产品编码：</label>
										<input type="text" class="form-control" name="sku" value="{$filter.sku}">
										
										<label class="control-label">最后操作人：</label>
										<input type="text" class="form-control" name="operate_user" value="{$filter.operate_user}">
																			
										<select class="form-control" name='time_type'>
			                				{foreach $time_type as $k => $v}
			                				<option value="{$k}" {if $k==$filter['time_type']}selected=selected{/if}>{$v}</option>
			                				{/foreach}		
		                				</select>
		                				<input type="text" class="form-control date_start" name="start" value="{$filter.start}">到
										<input type="text" class="form-control date_end" name="end" value="{$filter.end}">	
																			
										<label class="control-label ml10">FB反馈：</label>
										<select class="form-control" name='fb_feedback'>
											<option value=''>请选择</option>
											{foreach $fb_feedback as $k => $v}
											<option value='{$k}' {if $filter['fb_feedback'] != '' && $k eq $filter['fb_feedback']}selected=selected{/if}>{$v}</option>
											{/foreach}								
										</select>
										
										<label class="control-label ml10">是否推广：</label>
										<select class="form-control" name="is_extended">
											<option value="">请选择</option>
											<option value="1" {if $filter['is_extended'] != '' && $filter['is_extended'] eq 1}selected=selected{/if}>已推广</option>
											<option value="0" {if $filter['is_extended'] != '' && $filter['is_extended'] eq 0}selected=selected{/if}>未推广</option>																														
										</select>
									</p>	
										
									<p class="no-margin">	
										<label class="control-label">总实际缺货数：</label>
										<input type="text" class="form-control" name='lose_stock_min' value='{$filter.lose_stock_min}'>--
										<input type="text" class="form-control" name='lose_stock_max' value='{$filter.lose_stock_max}'>
										
										<label class="control-label">前7天销量：</label>
										<input type="text" class="form-control" name='seven_sale_min' value='{$filter.seven_sale_min}'>--
										<input type="text" class="form-control" name="seven_sale_max" value='{$filter.seven_sale_max}'>
										
										<label class="control-label">增长率：</label>
										<input type="text" class="form-control" name='rise_rate_min' value='{$filter.rise_rate_min}'>%--
										<input type="text" class="form-control" name='rise_rate_max' value='{$filter.rise_rate_max}'>%
																																																																																																																																																																						                						                						                						                																																
										<button type="submit" class="btn btn-primary btn-sm">立即搜索</button>
										
									</p>
								</div>
							</form>
						</div>
	                </div>
	                <!-- /.box-header -->

	                <div class="box-body">
						

	                  <table class="table table-bordered table-striped table-hover" id="js_productTable">
	                  	<thead>
	                    <tr>
	                   	
	                      <th width="65"><input type="checkbox" name="checkall"></th>
	                      <th data-field="operate" data-checked="true">操作</th>
	                      <th data-field="pcode" data-checked="true">产品编码</th>                      
	                      <th data-field="pcode" data-checked="true">产品图片</th>
	                      <th data-field="title" data-checked="true">订单占用量</th>
	                      <th data-field="product_from" data-checked="true">总实际缺货数</th>
	                      <th data-field="product_image" data-checked="true">在途库存</th>
	                      <th data-field="product_category" data-checked="true">前7天销量</th>
	                      <th data-field="develop_category" data-checked="true">近两天增长率</th>
	                      <th data-field="develop_website" data-checked="true">上架时间</th>
	                      <th data-field="apply_mark" data-checked="true">打样时间</th>
	                      <th data-field="apply_time" data-checked="true">预计回样时间</th>
	                      <th data-field="apply_user" data-checked="true">预计回大货时间</th>
	                      <th data-field="develop_time" data-checked="true">实际回样时间</th>
	                      <th data-field="develop_user" data-checked="true">实际回大货时间</th>
	                      <th data-field="develop_mark" data-checked="true">推广剩余天数</th>
	                      <th data-field="develop_status" data-checked="true">FB反馈</th>
	                      <th data-field="promote_time" data-checked="false">最后操作人</th>
	                      <th data-field="promote_user" data-checked="false">添加人</th>
	                      <th data-field="promote_mark" data-checked="false">添加时间</th>
	                      <th data-field="promote_status" data-checked="false">推广状态</th>
	                                       
	                    </tr>
	                    </thead>
	                    {foreach $list as $item}                  
	                    <tr>
							<td><input type="checkbox" name="checkitem" value='{$item.id}'></td>	
							<td>
								<div class="btn-group-vertical">
								{if $item.is_extended eq 0}
	                    		<a onclick='do_extend({$item.id},"{$item.sku}")' class="btn btn-primary btn-sm">推广</a>
	                    		{/if}
	                    		{if $item.fb_feedback eq 0}
	                    		<a onclick='do_feedback({$item.id},"{$item.sku}")' class="btn btn-primary btn-sm">FB反馈</a>
	                    		{/if}
	                    		{if $item.expect_pro eq ''}
	                    		<a onclick='do_expect_pro({$item.id},"{$item.sku}")' class="btn btn-primary btn-sm">预计回大货时间</a>
	                    		{/if}
	                    		{if $item.return_sample eq ''}
	                    		<a onclick='do_return_sample({$item.id},"{$item.sku}")' class="btn btn-primary btn-sm">预计回样时间</a>
	                    		{/if}
	                    		<a onclick='do_del({$item.id},"{$item.sku}")' class="btn btn-primary btn-sm">删除</a>
	                    		</div>
	                    	</td>                    	
							<td><a href="#" class="js_showChart" data-json="[{$item.seven_sale_trend}]">{$item.sku}</a></td>
							<td><img src="{$item.img}" alt=""></td>
							<td>{$item.order_num}</td>
							<td>{$item.lose_stock}</td>
							<td>{$item.tran_inventory}</td>
							<td>{$item.seven_sale}</td>
							<td>{$item.rise_rate}</td>
							<td>{$item.upshelf_time}</td>
							<td>{$item.sample_time}</td>
							<td>{$item.return_sample}</td>
							<td>{$item.expect_pro}</td>
							<td>{$item.real_return_sample}</td>
							<td>{$item.real_pro}</td>
							<td>{$item.days}</td>
							<td>{$fb_feedback[$item.fb_feedback]}</td>
							<td>
								<span style="cursor:pointer;" onmouseover="$('#operate-{$item.id}').show();" onmouseout="$('#operate-{$item.id}').hide();">
									{$item.operate_user}
								</span>
								<div style="position:relative;">
									<div style="position: absolute;float:right;padding:5px; width: 350px;overflow:hidden;text-align:left; border: 1px solid rgb(153, 153, 153);display:none;background: rgb(255, 255, 255);" id="operate-{$item.id}">
										<table class='table'>
											<tr>
												<th>操作内容</th>
												<th>操作人</th>
												<th>操作时间</th>
											</tr>
											{foreach $item['log'] as $l}
											<tr>
												<td>{$fb_operation[$l.type]}</td>
												<td>{$l.operater}</td>
												<td>{$l.handle_time}</td>
											</tr>
											{/foreach}
										</table>
									</div>
								</div>
							</td>
							<td>{$item.add_user}</td>
							<td>{$item.add_time}</td>
							<td>{if $item.is_extended}已推广{else}未推广{/if}</td>
							
						</tr>
						{/foreach}				                 
	              	</table>
	              	<div class="form-group-sm mt20">
	              		<button type="submit" class="btn btn-primary btn-sm" id='export_excel'>导出Excel</button>
	              	</div>
	                </div>
	                <!-- .box-body -->
	                <div class="box-footer text-center clearfix">
	                {$page_link}    
	                </div>
	              </div>
			</div>
		</div>
	</section>
</div>
<!-- FB反馈 -->
<div id="js_feedback" style="display:none;width:300px;;padding-top:10px;padding-left:10px;">
	<form class="form-horizontal">
		<div class="form-group">
		    <label class="col-sm-4 control-label">产品编码：</label>
		    <div class="col-sm-8">
		      <p class="form-control-static fb_feedback_sku"></p>
		    </div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label">FB反馈：</label>
			<div class="col-sm-6">
		     	<select class="form-control" id='js_fb_feedback'>
					<option value=''>请选择</option>
					{foreach $fb_feedback as $k => $v}
					<option value='{$k}'>{$v}</option>
					{/foreach}								
				</select>
		    </div>
		</div>
	</form>
</div>
<!-- 预计回大货时间-->
<div id="js_expect_pro" style="display:none;width:300px;;padding-top:10px;padding-left:10px;">
	<form class="form-horizontal">
		<div class="form-group">
		    <label class="col-sm-6 control-label">产品编码：</label>
		    <div class="col-sm-6">
		      <p class="form-control-static fb_feedback_sku"></p>
		    </div>
		</div>
		<div class="form-group">
			<label class="col-sm-6 control-label">预计回大货时间：</label>
			<div class="col-sm-6">
		     	<input type="text" class="form-control datepicker" id="expect_pro">
		    </div>
		</div>
	</form>
</div>
<!-- 预计回样时间 -->
<div id="js_return_sample" style="display:none;width:300px;;padding-top:10px;padding-left:10px;">
	<form class="form-horizontal">
		<div class="form-group">
		    <label class="col-sm-6 control-label">产品编码：</label>
		    <div class="col-sm-6">
		      <p class="form-control-static fb_feedback_sku"></p>
		    </div>
		</div>
		<div class="form-group">
			<label class="col-sm-6 control-label">预计回样时间：</label>
			<div class="col-sm-6">
		     	<input type="text" class="form-control datepicker" id='return_sample'>
		    </div>
		</div>
	</form>
</div>
<!-- 七天销量线形图载体 -->
<div id="chartPopShow" style="position: absolute; border: 1px solid rgb(221, 221, 221); width: 500px; height: 300px; left: 110px; top: 1113px; margin-top: -270px; display: none; background-color: rgb(255, 255, 255);"></div>

{include file='foot.tpl'}
<script src="{$js.url}highcharts/highcharts.js"></script>
<script>
{literal}
//全选反选
$.fn.check({checkall_name: "checkall", checkbox_name:"checkitem"});

//时间选择
$('.date_start').datetimepicker({
    format: "yyyy-mm-dd",
    minView:2,
    autoclose: true,
    todayHighlight: false
}).on('changeDate', function(ev){
    $(".date_end").val("").datetimepicker('setStartDate',$(this).val());
});
$('.date_end').datetimepicker({
    format: "yyyy-mm-dd",
    minView:2,
    autoclose: true,
    todayHighlight: false
});
$('.datepicker').datetimepicker({
 	format: "yyyy-mm-dd",
    minView:2,
    autoclose: true,
    todayHighlight: false
});
// 推广
function do_extend(id,sku) {
	layer.confirm("确定要推广编码为【 <span style='color:red;'>"+sku+" </span>】的产品吗？", function(){
		$.post('/purchase/sample-cloth/extend', {id:id}, function(res) {
			if(res.opr == '1'){
                layer.alert(res.content,8);
                location.reload();
            }else if(res.opr == '0'){
                layer.alert(res.content,8);
            }else {
            	layer.alert(res.message,8);
            }
		}, 'json');
	});
}
// FB反馈
function do_feedback(id,sku) {
	$(".fb_feedback_sku").html(sku);
	layer.open({
        type: 1,
        title:'FB反馈',
        area: ['320px', '200px'], //宽高
        zIndex : 1000,
        content: $("#js_feedback"),
        btn: ['确定', '取消'],
        yes:function() {
        	var feedback = $("#js_fb_feedback").val();
			if (feedback != '') {
				$.ajax({
					type:"POST",
			        url:"/purchase/sample-cloth/feed-back",
			        data:{'id':id,'feedback':feedback},
			        dataType: 'json',
			        success:function(res){
			            if(res.opr == '1'){
			                layer.alert(res.content,8);
			                location.reload();
			            }else if(res.opr == '0'){
			                layer.alert(res.content,8);
			            }else {
			            	layer.alert(res.message,8);
			            }
			        }
				});
			} else {
				layer.alert("请选择FB反馈");
			}
			return false;
        }
    });
}
// 预计回样时间
function do_return_sample(id,sku) {
	$(".fb_feedback_sku").html(sku);
	layer.open({
        type: 1,
        title:'预计回样时间',
        area: ['400px', '200px'], //宽高
        zIndex : 1000,
        content: $("#js_return_sample"),
        btn: ['确定', '取消'],
        yes:function() {
        	var return_sample = $("#return_sample").val();
			if (return_sample) {
				$.ajax({
					type:"POST",
			        url:"/purchase/sample-cloth/return-sample",
			        data:{'id':id,'return_sample':return_sample},
			        dataType: 'json',
			        success:function(res){
			            if(res.opr == '1'){
			                layer.alert(res.content,8);
			                location.reload();
			            }else if(res.opr == '0'){
			                layer.alert(res.content,8);
			            }else {
			            	layer.alert(res.message,8);
			            }
			        }
				});
			} else {
				layer.alert("请选择预计回样时间");
			}
			return false;
        }
    });
}
// 预计回大货时间
function do_expect_pro(id,sku) {
	$(".fb_feedback_sku").html(sku);
	layer.open({
        type: 1,
        title:'预计回大货时间',
        area: ['350px', '200px'], //宽高
        zIndex : 1000,
        content: $("#js_expect_pro"),
        btn: ['确定', '取消'],
        yes:function() {
        	var expect_pro = $("#expect_pro").val();
			if (expect_pro) {
				$.ajax({
					type:"POST",
			        url:"/purchase/sample-cloth/expect-pro",
			        data:{'id':id,'expect_pro':expect_pro},
			        dataType: 'json',
			        success:function(res){
			            if(res.opr == '1'){
			                layer.alert(res.content,8);
			                location.reload();
			            }else if(res.opr == '0'){
			                layer.alert(res.content,8);
			            }else {
			            	layer.alert(res.message,8);
			            }
			        }
				});
			} else {
				layer.alert("请选择预计回大货时间");
			}
			return false;
        }
    });
}

// 删除
function do_del(id,sku) {
	layer.confirm("确定要删除编码为【 <span style='color:red;'>"+sku+" </span>】的推广数据吗？", function(){
		$.post('/purchase/sample-cloth/del-fb', {id:id}, function(res) {
			if(res.opr == '1'){
                layer.alert(res.content,8);
                location.reload();
            }else if(res.opr == '0'){
                layer.alert(res.content,8);
            } else {
            	layer.alert(res.message,8);
            }
		}, 'json')
	});
}
// 导出到Excel
$("#export_excel").bind("click", function() {
	var ids = [];
	$("input[name=checkitem]").each(function(index,node){
		if ($(node).prop('checked')) {
			ids.push($(node).val());
		};
	})
	if (ids.length < 1) {
		layer.alert("请选择要导出的产品数据");
		return false;
	};

	location.href = '/purchase/sample-cloth/export-excel?id='+ids.join(); 
})

 $(".js_showChart").on('mouseenter',function(e){
    var $targetBox = $("#chartPopShow");
    var $chartBox = $('<div style="width:100%; height:100%"></div>')
    $targetBox.css({left:e.pageX+10,top:e.pageY+20}).html($chartBox).show();
    creatChart($chartBox,$(this).data('json'));
});
$(".js_showChart").on('mouseleave',function(e) {
    /* Act on the event */
    var $targetBox = $("#chartPopShow");
    $targetBox.hide().html('')
});
$(".js_showChart").on('mousemove',function(e){
    var $targetBox = $("#chartPopShow");
    
  var marginTop = 0;
   var $window = $(window);
    if(e.pageY- $window.scrollTop() +300 > $(window).height()){
        marginTop = $(window).height() -  e.pageY-300-20 +$window.scrollTop();
    }
   
    $targetBox.css({left:e.pageX+10,top:e.pageY+20,marginTop:marginTop});
})
function creatChart(obj,data){
    $(obj).highcharts({
       title: {
           text: '近7天销量走势图',
           x: -20 //center
       },
       
       xAxis: {
           categories: ['1', '2', '3', '4', '5', '6','7'],
            title: {
               text: '最近7天'
           },
       },
       yAxis: {
           title: {
               text: '销量'
           },
           plotLines: [{
               value: 0,
               width: 1,
               color: '#808080'
           }]
       },
       tooltip: {
           valueSuffix: '个'
       },
       legend: {
           layout: 'vertical',
           align: 'right',
           verticalAlign: 'middle',
           borderWidth: 0
       },
       series: [{
           name: '销量',
           data:data
       }]
   });
}
{/literal}
</script>
</body>
</html>
